
import React, { Component, PropTypes } from 'react';
import {
	Alert, Dimensions, StyleSheet, Text, View, ScrollView, TouchableOpacity, Platform,
} from 'react-native';
import { MtContainer, MtChar, MtFixedButton, MtLabelBar, MtToast, MtPopupPicker,MtNavBar,
	MtSeparator, MtDateTimePicker, MtColor, MtActionButton, MtListView, MtEmptyView } from 'martian-ui';
const DeviceCell = require('../components/DeviceCell');
import {fetchDeviceList} from '../action/girlAction';

import dismissKeyboard from 'react-native/Libraries/Utilities/dismissKeyboard';
const { MtM3, MtL3, MtW1 } = MtChar;
import TipBar from '../components/TipBar';
import values from 'lodash/values';
import keys from 'lodash/keys';
import {connect} from 'react-redux';
const EntityLabels = require('../constants/entities');
import assign from 'lodash/assign';
import ManageActionDevice from '../container/ManageActionDevice';
import NavigationBar from '../components/common/NavigationBar'
import Edit from '../components/common/ArgraceUI/Edit'


class ScenceName extends Component {
	constructor(props) {
		super(props)
		// 初始状态
		this.state = {
			scenceName: '',
		}
	}

	convertPropsToStates(props) {

	}

	componentWillReceiveProps(nextProps) {
		this.convertPropsToStates((nextProps));
	}
	componentWillMount() {
		this.convertPropsToStates(this.props);
	}

	render() {

		const  {navigator, fun, name} = this.props;
		const  {scenceName} = this.state;
    const rightElement = <Text style={styles.rightText} onPress={() => {
      fun(scenceName);
      navigator.pop();
    }}>保存</Text>
		return (
			<MtContainer>
        <NavigationBar
          title={'场景名称'}
          statusBar={{backgroundColor: '#ffffff', barStyle: 'dark-content'}}
          navigator={navigator}
          rightButton={rightElement}
          style={{borderBottomWidth: 1, borderColor: '#EDEDED', backgroundColor: '#ffffff'}}
        />
				<View style={{ }}>
				<Edit
          containerStyle={{ margin: 20, marginBottom: 10 }}
					ref={(input) => {
						this.input6 = input;
					}}
					defaultValue={name}
					maxLength={10}
					keyboardType="default"
					editable={true}
					placeholder="请输入场景名称"
					returnKeyType="next"
					onChangeText={(text) => {
						this.setState({ scenceName: text})
					}}
					onSubmitEditing={() => {
						dismissKeyboard();
					}}
				/>
				<Text style={{marginLeft: 20, fontSize: 12, color: '#666666'}}>
					4-16个字符，仅支持中文、英文大小写、数字及下划线
				</Text>
					</View>
			</MtContainer>

		);}
};


function mappingStateToProps(state, ownProps) {


	return {
	}
}
function mapDispatchToProps(dispatch) {

}


module.exports = connect(mappingStateToProps)(ScenceName);

const styles = StyleSheet.create({
	textRight: {
		textAlign: 'right',
	},
	manageDeviceTitleStyle:{
		textAlign: 'right',
		fontWeight:'bold',
		fontSize:16,
		color:'#000',
	},
	textRightColor: {
		textAlign: 'right',
		color: MtColor.main,
	},
	listViewStyle:{
		// 改变主轴的方向
		flexDirection:'row',
		// 多行显示
		flexWrap:'wrap',
		// 侧轴方向
		alignItems:'center', // 必须设置,否则换行不起作用
  },
  rightText: {
    fontSize: 16,
    color: '#333333',
  },
});
